.top-in{
    background-color: #dadada;
    height: 24px;
    width: 100%;
    border-bottom: 1px  solid #F0F8FF;
    .content{
        .welcom{
            float: left;
            font-size: 12px;
            line-height: 24px;
            a{
                color: #000000;
            }
        }
        .top-inlist{
            float: right;
            font-size: 12px;
            line-height: 24px;
            a{  
                color: #000000;
                &:hover{
                    text-decoration: underline;
                }
            }
            span{
                color: #000;
                padding-left:5px ;
            }
        }
    }
}
.top-on{
    width:100% ;
    height: 120px;
    .content{
        .logo-box{
            width: 100%;
            height: 120px;
            .logo{
                width: 100%;
                height: 120px;
                overflow: hidden;
                float: left;
                a{
                    img{
                        width: 200px;
                        height: auto;
                        margin: 25px 0;
                    }
                    .company-name{
                        position: relative;
                        .Ch-name{
                            position: absolute;
                            top: -80px;
                            left: 214px;
                            font-size:26px ;
                            font-weight: 500;
                            display: inline-block;
                            color: black;
                        }
                        .En-name{
                            position: absolute;
                            top: -47px;
                            left: 212px;
                            font-size: 10px;
                            font-weight: 500;
                            display: inline-block;
                            color: black;
                        }
                    }
                } 
                input#search-text{
                    color: #999999;
                    position: relative;
                    top: -71px;
                    left: 754px;
                    height: 25px;
                }
                #items{
                    color: #999999;
                    margin: -5px;
                    position: relative;
                    top: -71px;
                    left: 754px;
                    height: 31px;
                }
                #search-btn{
                    color: #999999;
                    position: relative;
                    top: -69px;
                    left: 754px;
                    width:40px ;
                    height: 31px;
                    .fa-search{
                        font-size:20px ;
                    }
                }
            }
        }
    }
}
.nav{
    height: 40px;
    background-color: #cc231c;
   .nav-list{
        li{
            float: left;
            width: 166px;
            text-align: center;
            &:hover{
                background-color: #dadada;
                ul{
                    overflow: hidden;
                    width: 100%;
                    height: 40px;
                    transition: height .5s ease-in;
                    -moz-transition:height .5s ease-in ;
                    -ms-transition: height .5s ease-in ;
                    -webkit-transition: height .5s ease-in ;
                    -o-transitain:height .5s ease-in ;
                    background-color: rgba(204,35,28,.5); 
                    li{
                        font-size: 12px;
                        &:hover{
                        background-color: rgba(204,35,28,0);
                        }
                        a{
                            color:#ddd;
                            &:hover{
                               color:white ;
                            }
                        }
                    }
                }
                a{
                    color:#000000;
                }
            }
            a{
                display: block;
                line-height:40px;
                &:hover{
                    color: #000000;
                }
            }
            ul{
                z-index: 1000;
                overflow: hidden;
                width: 100%;
                height: 0;
                position: absolute;
                left: 0px;
                transition: height .5s ease-in;
                -moz-transition:height .5s ease-in ;
                -ms-transition: height .5s ease-in ;
                -webkit-transition: height .5s ease-in ;
                -o-transitain:height .5s ease-in ;
                background-color: rgba(204,35,28,.5);
                .first{
                    margin-left: 350px;
                }
                li{
                    font-size: 12px;
                    &:hover{
                        background-color: rgba(204,35,28,0);
                    }
                   a{
                       color: #ddd;
                       &:hover{
                           color:white ;
                       }
                   }
                }
            }
        }
    }
}
.banner{
    height: 336px;
    width: 100%;
    overflow: hidden;
    .pic-b{
        width: 200%;
        li{
            width: 50%;
            float: left;
            display: block;
            img{
                height: 336px;
                width: 100%;
            }
        }
    }
    .dian{
        position: absolute;
        top: 500px;
        left: 89%;
        li{
            float:left;
            width: 10px;
            height: 10px;
            margin: 0 5px;
            background-color: #CC3A34;
            &:hover{
                background-color: antiquewhite;
            }
        }
    }
}